<!--{template /module/admin/view/head}-->
<div id="left_layout">
	<div id="main_content" class="container-fluid">
		<!--{template /module/admin/view/head_nav}-->
		<div class="row-fluid">
			<div class="well widget">
				<div class="widget-header">
					<p class="text">{lang admin.nav.view.header}</p>
				</div>
				<div class="widget-content">
					<div class="action-wrapper">
						<div class="pull-left">
							<a href="javascript:void(null);" id="btn_submit" class="btn btn-small btn-primary" {$dispatches[operations][edit]}>{lang admin.operation.submit}</a>
							<a href="javascript:void(null);" id="btn_delete_list" class="btn btn-small" {$dispatches[operations][delete]}>{lang admin.operation.delete}</a>
							<a href="javascript:void(null);" id="btn_add" class="btn btn-small" {$dispatches[operations][add]}>{lang admin.nav.view.operation.add}</a>
							
							<!--{if $GLOBALS['lang']['admin.nav.tips']}-->
							<a href="javascript:void(null);" id="btn_tips" class="btn btn-small">{lang admin.nav.view.operation.rule}</a>
							<!--{/if}-->
							
							<span class="help-inline">{lang admin.nav.view.operation.tips}</span>
						</div>
					</div>
					
					<hr/>
					<form id="frm_grid" name="frmGrid" action="{$ADMIN_SCRIPT}/admin/nav" method="post">
					<input type="hidden" name="formsubmit" value="yes" />
					<table class="table">
						<thead>
							<tr>
								<th width="40">
									<input type="checkbox" class="fancy" name="cbxAll"/>
								</th>
								<th width="100">{lang admin.nav.view.th.no}</th>
					            <th width="160">{lang admin.nav.view.th.name}</th>
					            <th>{lang admin.nav.view.th.link}</th>
					            <th width="180">{lang admin.nav.view.th.remark}</th>
					            <th width="120">{lang admin.nav.view.th.operate}</th>
							</tr>
						</thead>
						<tbody id="tbl_body">
							<!--{code $key = 1;}-->
							<!--{loop $nav_list $loop $nav}-->
							<tr ref="{$key}">
					        	<td colspan="6" style="padding:0px;">
					        		<table width="100%" class="table table-hover" style="margin:0px;">
					        			<tbody>
					        			<tr class="noborder">
								        	<td width="40">
								        		<input type="hidden" name="navid[{$key}]" value="{$nav[CATEGORYID]}"/>
								        		<input type="checkbox" class="fancy" name="cbxItem[]" title="{$nav[CNAME]}" value="{$nav[CATEGORYID]}"/>
								        	</td>
									    	<td width="100"><input type="text" class="input-mini" name="displayorder[{$key}]" value="{$nav[DISPLAYORDER]}" maxlength="4" /></td>
									        <td width="160">
									            <input type="text" class="input-medium" name="cname[{$key}]" value="{$nav[CNAME]}" maxlength="10"  />
									        </td>
									        <td>
									            <input type="text" class="input-xlarge" name="url[{$key}]" value="{$nav[URL]}" maxlength="50"  />
									        </td>
									        <td width="180">
									            <input type="text" class="input-medium" name="comment[{$key}]" value="{$nav[_COMMENT]}" maxlength="20" />
									        </td>
									        <td width="120">
									        	<a class="btn btn-mini" ref="{$key}" href="javascript:void(null);" {$dispatches[operations][add]}>{lang admin.nav.view.td.operate.add}</a>
									        </td>
								        </tr>
								        <!--{loop $nav['CATEGORIES'] $ckey $cnav}-->
								        <tr class="child">
								        	<td class="space">
								        		<input type="hidden" name="cnavid[{$key}][]" value="{$cnav[CATEGORYID]}"/>
								        		<input type="checkbox" class="fancy" name="cbxItem[]" title="{$cnav[CNAME]}" value="{$cnav[CATEGORYID]}"/>
								        	</td>
									    	<td class="space"><input type="text" class="input-mini" name="cdisplayorder[{$key}][]" value="{$cnav[DISPLAYORDER]}" maxlength="4" /></td>
									        <td class="space">
									            <input type="text" class="input-medium" name="ccname[{$key}][]" value="{$cnav[CNAME]}" maxlength="10"  />
									        </td>
									        <td>
									            <input type="text" class="input-xlarge" name="curl[{$key}][]" value="{$cnav[URL]}" maxlength="100"  />
									        </td>
									        <td>
									            <input type="text" class="input-medium" name="ccomment[{$key}][]" value="{$cnav[_COMMENT]}" />
									        </td>
									        <td>
									        	—
									        </td>
								        </tr>
								        <!--{/loop}-->
								        
								        <tr class="child" style="display:none;">
								        	<td class="space">{lang admin.nav.view.td.add}</td>
									    	<td class="space">
										    	<input type="hidden" name="cnavid[][]" value=""/>
										    	<input type="text" class="input-mini" name="cdisplayorder[][]" value="" maxlength="4" />
									    	</td>
									        <td class="space">
									            <input type="text" class="input-medium" name="ccname[][]" value="" maxlength="10"  />
									        </td>
									        <td>
									            <input type="text" class="input-xlarge" name="curl[][]" value="" maxlength="100"  />
									        </td>
									        <td>
									            <input type="text" class="input-medium" name="ccomment[][]" value="" />
									        </td>
									        <td>
									        	—
									        </td>
								        </tr>
								        </tbody>
							        </table>
					        	</td>
						    </tr>
						    <!--{code $key = $key + 1;}-->
						    <!--{/loop}-->
						    
						    <!--{if count($nav_list) == 0}-->
					        <tr id="tr_empty">
					            <td colspan="6">
					                * {lang admin.operation.empty}
					            </td>
					        </tr>
					        <!--{/if}-->
					        
					        <tr ref="0" style="display:none;">
					        	<td colspan="6" style="padding:0px;">
					        		<table width="100%" class="table table-hover" style="margin:0px;">
					        			<tbody>
					        			<tr class="noborder">
								        	<td width="40">{lang admin.nav.view.td.add}</td>
									    	<td width="100">
									    		<input type="text" class="input-mini" name="displayorder[]" value="" maxlength="4" />
									    	</td>
									        <td width="140">
									            <input type="text" class="input-small" name="cname[]" value="" maxlength="10"  />
									        </td>
									        <td>
									            <input type="text" class="input-xlarge" name="url[]" value="" maxlength="100"  />
									        </td>
									        <td width="180">
									            <input type="text" class="input-medium" name="comment[]" value="" />
									        </td>
									        <td width="120">
									        	<a class="btn btn-mini" ref="0" href="javascript:void(null);" {$dispatches[operations][add]}>{lang admin.nav.view.td.operate.add}</a>
									        </td>
								        </tr>
								        <tr class="child" style="display:none;">
								        	<td class="space">{lang admin.nav.view.td.add}</td>
									    	<td class="space"><input type="text" class="input-mini" name="cdisplayorder[][]" value="" maxlength="4" /></td>
									        <td class="space">
									            <input type="text" class="input-small" name="ccname[][]" value="" maxlength="10"  />
									        </td>
									        <td>
									            <input type="text" class="input-xlarge" name="curl[][]" value="" maxlength="100"  />
									        </td>
									        <td>
									            <input type="text" class="input-medium" name="ccoment[][]" value="" />
									        </td>
									        <td>
									        	—
									        </td>
								        </tr>
								        </tbody>
							        </table>
					        	</td>
						    </tr>
						</tbody>
					</table>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>

<div id="div_nav_tips" style="display:none;">{lang admin.nav.tips}</div>

<script>
var nav_count = {echo count($nav_list);};

function check_and_bind(){
	if($('#tbl_body tr').length > 4) $('#tr_empty').hide();
	else $('#tr_empty').show();
	
	$('#tbl_body .btn-mini').unbind('click').click(function(){
		var ref = $(this).attr('ref');
		
		var tbody = $(this).parent().parent().parent().get(0);
    	var tempInsertRow = tbody.rows[tbody.rows.length - 1];
    	var tempNewRow = tempInsertRow.cloneNode(true);
    	tempNewRow.style.display = '';
    	
    	var inputs = tempNewRow.getElementsByTagName('input');
    	for(var i = 0; i < inputs.length; i++){
    		if(inputs[i].name.indexOf('cdisplayorder') != -1 
    			|| inputs[i].name.indexOf('ccname') != -1 
    			|| inputs[i].name.indexOf('curl') != -1 
    			|| inputs[i].name.indexOf('cnavid') != -1 
    			|| inputs[i].name.indexOf('ccomment') != -1){
    			inputs[i].value = '';
    			$(inputs[i]).attr('name', inputs[i].name.replace('[][]', '[' + ref + '][]'));
    		}
    	}
    	
    	tbody.insertBefore(tempNewRow, tbody.rows[tbody.rows.length - 1]);
	});
}

$(function(){
	$('.fancy').uniform();
	
	$('#btn_submit').click(function(){
		$('#frm_grid').submit();
	});
	
	$('#btn_delete_list').click(function(){
		if($("#frm_grid input[name='cbxItem[]']:checked").length > 0){
			var tempHTML = '<p>';
			$("#frm_grid input[name='cbxItem[]']:checked").each(function(){
				tempHTML += $(this).attr('title') + '； ';
			});
			
			tempHTML += '</p>';
			
			$.dialog({submit:'{lang admin.operation.delete}', message:'<p>{lang admin.nav.view.message.delete}</p>' + tempHTML, callback:function(){
				$('#modal_dialog .btn-primary').click(function(){
					$('#frm_grid').attr('action', '{$ADMIN_SCRIPT}/admin/nav&do=delete_list&parentid={$_var[gp_parentid]}');
					$('#frm_grid').submit();
				});
			}});
		}else $.dialog({message:'{lang admin.nav.view.message.delete.empty}'});
	});
	
	$('#btn_add').click(function(){
		nav_count++;
		
		var tbody = $('#tbl_body').get(0);
    	var tempInsertRow = tbody.rows[tbody.rows.length - 1];
    	var tempNewRow = tempInsertRow.cloneNode(true);
    	tempNewRow.style.display = '';
    	
    	var inputs = tempNewRow.getElementsByTagName('input');
    	for(var i = 0; i < inputs.length; i++){
    		if(inputs[i].name.indexOf('displayorder') != -1 
    			|| inputs[i].name.indexOf('cname') != -1 
    			|| inputs[i].name.indexOf('url') != -1 
    			|| inputs[i].name.indexOf('remark') != -1) {
    			inputs[i].value = '';
    			
    			$(inputs[i]).attr('name', inputs[i].name.replace('[]', '[' + nav_count + ']'));
    		}
    	}
    	
    	$('a', tempNewRow).attr('ref', nav_count);
    	
    	tbody.insertBefore(tempNewRow, tbody.rows[tbody.rows.length - 1]);
    	
    	check_and_bind();
	});
	
	$('#btn_tips').click(function(){
		$.dialog({title:'{lang admin.nav.view.message.title.rule}', width:500, message:$('#div_nav_tips').html()});
	});
	
	$("#frm_grid input[name='cbxAll']").click(function(){
		if(this.checked){
			$('#frm_grid .item-row').addClass('warning');
			$("#frm_grid input[name='cbxItem[]']").attr('checked', true).parent().addClass('checked');
		}else{
			$('#frm_grid .item-row').removeClass('warning');
			$("#frm_grid input[name='cbxItem[]']").attr('checked', false).parent().removeAttr('class');
		}
	});
	
	$("#frm_grid input[name='cbxItem[]']").click(function(){
		if(this.checked) $(this).parent().parent().parent().parent().addClass('warning');
		else $(this).parent().parent().parent().parent().removeClass('warning');
	});
	
	check_and_bind();
});
</script>

<!--{template /module/admin/view/foot}-->